/**
 * Created by Administrator on 2016/7/26.
 */
$(function(e){
    //购物车下拉
    $('.nav-right2 a').mouseover(function(){
        $('.nav-right-down').slideDown('slow');

    })
    $('.nav-right2').mousemove(function(){
        $('.nav-right2 a').css({
            background:'#fff',
            color:'#ff6700'
        })
    })
    $('.nav-right2').mouseleave(function(){
        $('.nav-right-down').slideUp('slow');
        $('.nav-right2 a').css({
            background:'#333',
            color:'#b0b0b0'
        })
    })



    //用户名下滑
    $('.user-name').mouseover(function(){
        $('.user-down').slideDown('slow');
        $('.user-name span').css({
            color:'#ff6700',
        })
    })
    $('.user-down').mousemove(function(){
        $('.user-down').css('display','block')
    })
    $('.user-up').mouseleave(function(){
        $('.user-down').slideUp('fast');
        $('.user-name,.user-name span').css({
            backgroundColor:'#333',
            color:'#b0b0b0',
        })
    })
    $('.user-down').mouseover(function(){
        $('.user-name').css({
            backgroundColor:'#fff',
            color:'#424242',
        })
        $('.user-name span').css({
            color:'#424242',
        })
        $('.user-name').mouseover(function(){
            $('.user-name,.user-name span').css({
                backgroundColor:'#fff',
                color:'#ff6700'
            })
        })
    })

    
    
    $('input[type=text]').click(function (event)
    {
        $('.inputin').css('display','none');
        $('.list1').css('display','block');
        $('input[type=submit]').css('border','1px solid #ff6700')
        event.stopPropagation()
        document.onclick = function ()
        {
            if($('input[type=text]').val()){
                $('.inputin').css('display','none');
            }else{
                $('.inputin').css('display','block');
            }
            $('.list1').css('display','none');
            $('input[type=submit]').css('border','')
        };
    }) ;
    for (i = 0; i < $('.list1 li').length; i++)
    {
        //鼠标划过
        $('.list1 li').eq(i).mouseover(function ()
        {
            this.className = "hover"
        });
        //鼠标离开
        $('.list1 li').eq(i).mouseout(function ()
        {
            this.className = "";
        });
        $('.list1 li').eq(i).click(function (event)
        {
            event.stopPropagation()
            $('.list1').css('display','none');
            $('.inputin').css('display','none');
            $('input[type=submit]').css('border','')
            $('input[type=text]').val(this.children[0].innerHTML);
        }) ;
    }



    //导航栏下拉
    $('.down').each(function(index){
        $(this).mouseover(function(){
            $('.container-down1 ul').css('display','none').eq(index).css('display','block');
            $('.container-down1').slideDown('slow');
        })
    });
    $('.up').mouseleave(function(){
        $('.container-down1').slideUp('slow');
    });
    $('.up2').mouseenter(function(){
        $('.container-down1').slideUp('slow');
    })


    //左侧侧边栏
    $('.home-container-left .fl li').each(function(index){
        $(this).mouseover(function(){
            $('.home-container-down').css('display','none').eq(index).css('display','flex');
            $('.home-container-down').mousemove(function(){
                $('.home-container-down').css('display','none').eq(index).css('display','flex');
            })
        })

    });

    $('.home-container-left').mouseout(function(){
        $('.home-container-down').css('display','none');
    })

    //搜索框
    $('input[type=submit]').hover(function(){
        $('.box form span').css('color','white');
        $('input[type=submit]').css('background','#ff6700')
        $('form span').mouseover(function(){
            $('.box form span').css('color','white');
            $('input[type=submit]').css('background','#ff6700')
        })
    },function(){
        $('form span').mouseout(function(){
            $('.box form span').css('color','white');
            $('input[type=submit]').css('background','#fff')
        })
        $('.box form span').css('color','#333');
        $('input[type=submit]').css('background','#fff')
    })
   

    //左侧导航栏
    $('.home-container-down div').each(function(){
        $(this).children('span').hover(function(){
            $(this).css('color','#ff6700');
        },function(){
            $(this).css('color','#333');
        });
    });
    $('.home-container-down li').each(function(index){
        $(this).hover(function(){
            $('.home-container-down li span').eq(index).css('color','#ff6700');
        },function(){
            $('.home-container-down li span').eq(index).css('color','#333');
        });
    })


    //小米单星产品
   function homeProduct(){
       var Li = $('.home-container-product ul li'),
           ul = $('.home-container-product ul'),
           LiWidth = Li.width(),
           LiLength = Li.length,
           timer2,
           toggle = true;
       ul.width(LiWidth  * LiLength + 140 + 'px');
       $('.home-container-product-control span').eq(1).mousedown(function(e){
           clearInterval(timer2);
           toggle = !toggle;
           ul.animate({left:-1240 + 'px'}, 500);
           $(this).addClass('nodisable').siblings().removeClass('nodisable');
       });
       $('.home-container-product-control span').eq(0).mousedown(function(e){
           clearInterval(timer2);
           toggle = !toggle;
            ul.animate({left:0}, 500)
            $(this).addClass('nodisable').siblings().removeClass('nodisable');
       });
       $('.home-container-product-control span').mouseup(function(){
           autoPlay();
       })
       function play(){
           if(toggle){
               ul.animate({left:-1240 + 'px'}, 500);
               toggle = !toggle;
               $('.home-container-product-control span').eq(1).addClass('nodisable').siblings().removeClass('nodisable');
           }else {
               ul.animate({left:0 + 'px'}, 500);
               toggle = !toggle;
               $('.home-container-product-control span').eq(0).addClass('nodisable').siblings().removeClass('nodisable');
           }
       }
       function autoPlay(){
           timer2 =  setInterval(play,5000);
       }
        autoPlay();
   }
    homeProduct();


    //主体产品tab切换
    //遮罩层
    $('.main-container ul li').each(function(){
        $(this).hover(function(){
            $(this).children('.product-review').slideDown("fast").css('opacity',1)
        },function(){
            $(this).children('.product-review').slideUp("fast").css('opacity',0)
        })
    })



    //li切换
    $('.main-head1 ul li').each(function(index){
        $(this).hover(function(){
            $('.main-head1 ul li').removeClass('main-active');
            $(this).addClass('main-active')
        })
    })
    $(' .main-head2 ul li').each(function(index){
        $(this).hover(function(){
            $('.main-head2 ul li').removeClass('main-active');
            $(this).addClass('main-active')
        })
    })
    $(' .main-head3 ul li').each(function(index){
        $(this).hover(function(){
            $('.main-head3 ul li').removeClass('main-active');
            $(this).addClass('main-active')
        })
    })
    //ul切换
    $('.main-head1 ul li').each(function(index){
        $(this).mouseover(function(){
            $('.main-dapei ul').removeClass('main-show').eq(index).addClass('main-show');
        });
    })
    $('.peijian .main-head2 ul li').each(function(index){
        $(this).mouseover(function(){
            $('.main-peijian ul').removeClass('main-show').eq(index).addClass('main-show');
        });
    })
    $('.zhoubian .main-head3 ul li').each(function(index){
        $(this).mouseover(function(){
            $('.main-zhoubian ul').removeClass('main-show').eq(index).addClass('main-show');
        });
    })



    //为你推荐
    function forYou(){
        var forYouUl = $('.foryou-container ul'),
            forYouLi = forYouUl.children('li'),
            forYouLiWidth = forYouLi.width(),
            forYouLiLength = forYouLi.length,
            forLeft = $('.foryou .for-left'),
            forRight = $('.foryou .for-right'),
            forNumber = 0;
        forYouUl.width(forYouLiWidth * forYouLiLength + 280 + 'px');

        forLeft.click(function(){
            if(forNumber <= 0) {
                return false;
            }
            forNumber --;
            forYouUl.css('marginLeft', '+=' + (forYouLiWidth * 5 + 70) + 'px');
            forYouPic();
        });
        forRight.click(function(){
            if(forNumber >= 3) {
                return false;
            }
            forNumber ++;
            forYouUl.css('marginLeft', '-' + (forYouLiWidth * 5 + 70) * forNumber + 'px');
            forYouPic();
        })

        function forYouPic(){
            if (forNumber >= 3) {
                forRight.css({cursor: 'auto'});
                forRight.addClass("noclick");
                forLeft.hover(function(){
                    forLeft.css('color','#ff6700')
                },function(){
                    forLeft.css('color','#333')
                })
                forRight.hover(function(){
                    forRight.css('color','#e0e0e0')
                },function(){
                    forRight.css('color','#e0e0e0')
                })
            }
            //点来点去的情况下，正规点击的时候
            else if (forNumber > 0 && forNumber <= 2) {
                forLeft.css({cursor: 'pointer',color:'#333'});
                forLeft.removeClass("noclick");
                forRight.css({cursor: 'pointer',color:'#333'});
                forRight.removeClass("noclick");
                forLeft.hover(function(){
                    forLeft.css('color','#ff6700')
                },function(){
                    forLeft.css('color','#333')
                })
                forRight.hover(function(){
                    forRight.css('color','#ff6700')
                },function(){
                    forRight.css('color','#333')
                })
            }
            //到达第一张图的情况下
            else if (forNumber <= 0) {
                forLeft.css({cursor: 'auto'});
                forLeft.addClass("noclick");
                forLeft.hover(function(){
                    forLeft.css('color','#e0e0e0')
                },function(){
                    forLeft.css('color','#e0e0e0')
                })
                forRight.hover(function(){
                    forRight.css('color','#ff6700')
                },function(){
                    forRight.css('color','#333')
                })
            }
        }


    };
    forYou();
    
    //内容模块
    function contentOpacity(){
        $('.content .content-ul-out > li').each(function(){
            $(this).hover(function(){
                $(this).find('.content-control').css('opacity','0.4');
            },function(){
                $(this).find('.content-control').css('opacity',0);
                $(this).find('.content-control').each(function(){
                    $(this).mouseleave(function(){
                        $(this).css('opacity',0.4)
                    })
                })
            })
            $(this).mousemove(function(){
                $(this).find('.content-control').each(function(){
                    $(this).mouseleave(function(){
                        $(this).css('opacity',0.4)
                    })
                })
            })
            $(this).find(' .content-control').each(function(){
                $(this).hover(function(e){
                    e.stopPropagation()
                    $(this).css('opacity','1').siblings().css('opacity',0.4);
                },function(){
                    $(this).css('opacity',0.4);
                })
            })
        })
    }
    contentOpacity();
    function contentPlay() {
        var infoUl = $('.content-ul-out'),
            infoLi = infoUl.children('li'),
            infoLiWidth = infoLi.width();


        infoLi.each(function(){
            var left = $(this).find('.content-left'),
                right = $(this).find('.content-right'),
                infoNumber = 0,
                listLi = $(this).find('.content-list ul li'),
                infoLiNow = $(this);
            function infoActive(){
                listLi.removeClass('content-list-active');
                listLi.eq(infoNumber).addClass('content-list-active');
            }
            left.click(function(){
                if(infoNumber <= 0){
                    return false
                }
                infoNumber --;
                infoLiNow.find('.content-ul-info').css('marginLeft','+=' + infoLiWidth + 'px' )
                infoActive()
            });
            right.click(function(){
                if(infoNumber >= 3){
                    return false
                }
                infoNumber ++;
                infoLiNow.find('.content-ul-info').css('marginLeft','-=' + infoLiWidth + 'px' );
                infoActive()
            })
            listLi.each(function(index){
                $(this).click(function(){
                    infoNumber = index;
                    infoLiNow.find('.content-ul-info').css('marginLeft', '-' + infoLiWidth * infoNumber + 'px' )
                    infoActive()
                })
            })
        })
    }
    contentPlay();


    // 视频
    $('.video-info ul li a').each(function(index){
        $(this).hover(function(){
            $('.video-info ul li a span').eq(index).css({'background-color':'#ff6700','border-color':'#ff6700'});

        },function(){
            $('.video-info ul li a span').eq(index).css({'background-color':'rgba(0,0,0,0.6)','border-color':'#fff'});
        })
    })
    
    
    






})

